<template>
	<view class="reward">
		<view class="box">
			<block-swipers :data="swipers" :listHeight="110"></block-swipers>
			<block-title :title="'悬赏主管理'" :toast="'悬赏主须知'" :goUrl="'/pages/public/agreement/agreement?name=悬赏主须知&keyword=lord_rule'">
			</block-title>
			<view class="to-examine" v-if="exNum>0">
				<text>* 当前未审核 {{exNum}}名，请尽快完成审核</text>
				<text @click="goPage('/pages/mutual/examine/examine?id=46')">去审核</text>
			</view>
			<view class="lists">
				<view class="list" @click="goPage('/pages/mutual/release-box/release-box?cate=0&&titleTabar='+'审核中')">
					<text class="iconfont icon-shenhe"></text>
					<text>审核中({{sumData.examine || 0}})</text>
				</view>
				<view class="list" @click="goPage('/pages/mutual/release-box/release-box?cate=1&&titleTabar='+'展示中')">
					<text class="iconfont icon-zhanshi"></text>
					<text>展示中({{sumData.exhibition || 0}})</text>
				</view>
				<view class="list" @click="goPage('/pages/mutual/release-box/release-box?cate=2&&titleTabar='+'已暂停')">
					<text class="iconfont icon-zanting"></text>
					<text>已暂停({{sumData.stop || 0}})</text>
				</view>
				<view class="list" @click="goPage('/pages/mutual/release-box/release-box?cate=3&&titleTabar='+'审核失败')">
					<text class="iconfont icon-shibai"></text>
					<text>审核失败({{sumData.fail || 0}})</text>
				</view>
			</view>
			<block-title :title="'我的任务'"></block-title>
		</view>
		<view class="tabs isfiexd" v-if="isFixed" :style="{top:BarHeight+'upx'}">
			<view class="tab" :class="active===item.id ? 'active' :''" v-for="(item,index) of tabs" :key="index"
				@click="handleTab(item.id)">
				{{item.title}}
			</view>
		</view>
		<view class="tabs">
			<view class="tab" :class="active===item.id ? 'active' :''" v-for="(item,index) of tabs" :key="index"
				@click="handleTab(item.id)">
				{{item.title}}
			</view>
		</view>
		<view class="tabs-content">
			<view class="tabs-content-lists">
				<view class="tabs-content-list" v-for="(item,index) of myData" :key="index">
					<view class="list-item" @click="goPage('/pages/mutual/detail/detail?id='+item.rid)">
						<view class="left">
							<view class="left-contet">
								<view class="title fex1">
									{{item.name}}
								</view>
								<view class="countdown" v-if="active===0">
									<text style="padding-right: 10upx;">{{formatDate(item.end_time*1000)}}</text>
									<text>前提交</text>
								</view>
								<view class="countdown" v-else>
									<text style="padding-right: 10upx;">{{formatDate(item.complete_time*1000)}}</text>
								</view>
							</view>
						</view>
						<view class="right">
							<view class="right-money">
								<text>赏金</text>
								<text>{{item.price}}</text>
							</view>
						</view>
					</view>
					<view class="fail" v-if="(item.complete_status===3 || item.complete_status===6) && item.fail_content">
						* {{item.fail_content}}
					</view>
					<view class="list-btns" v-if="item.complete_status===0">
						<view class="btn" @click="clearBtn(item.id,item.rid)">
							<span>取消报名</span>
						</view>
						<view class="btn" @click="goPage('/pages/mutual/detail/detail?id='+item.rid)">
							<span>继续任务</span>
						</view>
					</view>
					<view class="list-btns" v-if="item.complete_status===4">
						<view class="btn" @click="baoming(item.rid,'edit')">
							<span>重新报名</span>
						</view>
						<view class="btn" @click="clearBtn(item.id,item.rid)">
							<span>取消报名</span>
						</view>
					</view>
					<view class="list-btns" v-if="item.complete_status===2">
						<view class="btn" @click="goPage('/pages/mutual/detail/detail?id='+item.rid)">
							<span>查看任务</span>
						</view>
						<view class="btn" @click="goPage('/pages/mutual/evaluate/evaluate?id='+item.rid)">
							<span>评价任务</span>
						</view>
					</view>
					<view class="list-btns list-btns3" v-if="item.complete_status===3">
						<view class="btn" @click="goPage('/pages/mutual/appeal/appeal?id='+item.id)">
							<span>申诉任务</span>
						</view>
						<view class="btn" @click="clearBtn(item.id,item.rid)">
							<span>取消任务</span>
						</view>
					</view>
					<view class="list-btns list-btns3" v-if="item.complete_status===5">
						<view class="btn" @click="goPage('/pages/mutual/appeal/appeal?id='+item.id)">
							<span>查看申诉</span>
						</view>
						<view class="btn" @click="clearBtn(item.id,item.rid)">
							<span>取消申诉</span>
						</view>
					</view>
					<view class="list-btns list-btns3" v-if="item.complete_status===6">
						<view class="btn" @click="goPage('/pages/mutual/appeal/appeal?id='+item.id)">
							<span>查看申诉</span>
						</view>
						<view class="btn" @click="delBtn(item.id)">
							<span>删除任务</span>
						</view>
					</view>
				</view>
			</view>
			<block-loading :status="status" :len="myData.length"></block-loading>
		</view>
	</view>
</template>

<script>
	import BlockSwipers from '@/components/BlockSwipers/BlockSwipers.vue'
	import BlockNotice from '@/components/BlockNotice/BlockNotice.vue'
	import BlockTitle from "@/components/BlockTitle/BlockTitle.vue"
	import {formatDate} from '@/utils/util.js'
	import {enroll} from "@/api/reward.js"
	import {
		banner,
	} from '@/api/index.js'
	import {
		rewardSum,
		userRewardLists,
		clearEnroll,
		delEnroll,
		getUserSum
	} from '@/api/reward.js'
	export default {
		name: "reward",
		components: {
			BlockSwipers,
			BlockNotice,
			BlockTitle
		},
		data() {
			return {
				//轮播
				swipers: [],
				active: 0,
				sumData:{},
				tabs: [{
						id: 0,
						title: "进行中"
					},
					{
						id: 1,
						title: "审核中"
					},
					{
						id: 2,
						title: "已通过"
					},
					{
						id: 3,
						title: "未通过"
					}
				],
				fullHeight: 0,
				isFixed: false,
				screenHeight: 0,
				status: "loading",
				myData:[],
				page:1,
				exNum:0,
			}
		},
		async onShow() {
			//数量
			rewardSum().then(res => {
				this.sumData = res.data
			})
			let res = await getUserSum();
			if(res.code === 1){
				this.exNum = res.data.num
			}
		},
		onLoad() {
			//banner
			banner({source:'reward'}).then(res => {
				this.swipers = res.data
			})
			//获取数据
			this.getLists();
		},
		onNavigationBarButtonTap(e) {
			uni.navigateTo({
				url:"/pages/mutual/release/release"
			})
		},
		//下拉刷新
		async onPullDownRefresh() {
			rewardSum().then(res => {
				this.sumData = res.data
			})
			let res = await getUserSum();
			if(res.code === 1){
				this.exNum = res.data.num;
				uni.stopPullDownRefresh();
			}
			this.page=1;
			this.myData = [];
			this.getLists();
		},
		onPageScroll(res) {
			if (res.scrollTop >= this.fullHeight) {
				this.isFixed = true;
			} else {
				this.isFixed = false;
			}
		},
		mounted() {
			const res = uni.getSystemInfoSync();
			let winrate = 750 / res.windowWidth;
			// #ifdef H5 || MP-WEIXIN
			this.BarHeight = res.windowTop * winrate;
			// #endif
			// #ifdef APP-PLUS
			this.BarHeight = 0;
			// #endif
			this.screenHeight = (res.windowHeight - res.statusBarHeight) * winrate - 90;
			this.$nextTick(() => {
				const query = uni.createSelectorQuery().in(this);
				query.select('.box').boundingClientRect(data => {
					this.fullHeight = data.height;
				}).exec();
			})
		},
		methods: {
			formatDate(val){
				return formatDate(val)
			},
			handleTab(id) {
				this.active = id
				this.myData = []
				this.page = 1;
				this.getLists();
			},
			goPage(url){
				uni.navigateTo({
					url:url
				})
			},
			async getLists(){
				let res = await userRewardLists({status:this.active,page:this.page,size:20});
				if(this.page===1&&res.data.length === 0){
					this.status = "nodata"
					return
				}
				if(this.page===1&&res.data.length > 0 && res.data.length < 20){
					this.status = "nomore"
				}
				if(res.data.length === 0){
					this.status = "nomore"
					return;
				}
				this.page++;
				this.myData = this.myData.concat(res.data);
			},
			//取消报名
			async clearBtn(id,rid){
				let res = await clearEnroll({id:id,rid:rid})
				if(res.code === 1){
					this.myData = this.myData.filter((item)=>{
						return item.id !== id
					})
					if(this.myData.length === 0){
						this.status = "nodata"
					}
					return;
				}
				this.$msg(res.msg)
			},
			async baoming(id,action){
				let res = await enroll({id:id,action:action});
				if(res.code === 1){
					for(let item of this.myData){
						if(item.rid === id){
							item.complete_status = 0;
							item.end_time = res.data.time
						}
					}
				}
				this.$msg(res.msg)
			},
			//删除悬赏
			async delBtn(id){
				let res = await delEnroll({id:id})
				if(res.code === 1){
					this.myData = this.myData.filter((item)=>{
						return item.id !== id
					})
					if(this.myData.length === 0){
						this.status = "nodata"
					}
					return;
				}
				this.$msg(res.msg)
			},
		}
	}
</script>

<style scoped lang="less" src="./reward.less"></style>
